<template>
<div>
  <h2>Music组件</h2>
<!--  query传参-->
<!--  <router-link tag="button" to="/home/music/musicDetail?name=周杰伦&age=18">周杰伦</router-link>-->
<!--  <router-link tag="button" to="/home/music/musicDetail?name=林俊杰&age=19">林俊杰</router-link>-->
<!--  <router-link tag="button" to="/home/music/musicDetail?name=薛之谦&age=21">薛之谦</router-link>-->
  <button @click="$router.push({name:'MusicDetail',query:{name:'周杰伦',age:18}})">周杰伦</button>
  <button @click="$router.push({name:'MusicDetail',query:{name:'周杰伦',age:19}})">林俊杰</button>
  <button @click="$router.push({name:'MusicDetail',query:{name:'周杰伦',age:21}})">薛之谦</button>
  <router-view></router-view>
</div>
</template>

<script>
export default {
  name: "Music"
}
</script>

<style scoped>

</style>